<template>
  <div>
    <hamburger
      :is-active="sidebar.opened"
      class="hamburger-container"
      @toggleClick="toggleSideBar"
    />
    <div class="wscn-http403-container">
      <div class="wscn-http403">
        <div class="pic-403">
          <img class="pic-403" src="@/assets/403/403.png" alt="403" />
        </div>
        <div class="footer">
          <div class="bullshit__info">
            All rights reserved
            <a
              style="color: #20a0ff"
              href="http://www.neoway.com/"
              target="_blank"
              >有方科技</a
            >
          </div>
          <a href="" style="color: #20a0ff" class="bullshit__return-home"
            >Back to home</a
          >
        </div>
      </div>
    </div>
  </div>
</template>

<script setup>
const appStore = useAppStore()
const { sidebar } = storeToRefs(appStore)

function toggleSideBar() {
  appStore.toggleSideBar()
}
</script>

<style lang="scss" scoped>
.wscn-http403-container {
  position: absolute;
  top: 50px;
  left: 0;
  right: 0;
  bottom: 0;
  background: #f7f7f7;
  .pic-403 {
    text-align: center;
    img {
      height: 600px;
    }
  }
}
.footer {
  text-align: center;
}
</style>
